<template>
	<view>
		<view class="qrcode">
			<image :src="qrCodeUrl"></image>
		</view>
	</view>
</template>

<script>
	export default {
		name: "createQrCode",
		data() {
			return {
				textContent: '',
				qrCodeUrl: '',
			};
		},
		// 接收参数
		props: {
			content: {
				type: String,
				default: ''
			}
		},
		// 监听数据发生变化
		watch: {
			content(newVal, oldVal) {
				this.textContent = newVal
				// this.qrcode()
				this.generateQRCode()
			},
		},

		methods: {
			qrcode() {
				console.log("2222222", this.textContent);
				// const base64 = uni.base64ToArrayBuffer(this.textContent)
				const encoder = new TextEncoder();
				const data = encoder.encode(this.textContent);
				const base64 = uni.base64ToArrayBuffer(data);
				console.log('转码后', base64);
			},
			generateQRCode() {
				const url = 'https://api.qrserver.com/v1/create-qr-code/'
				const size = '200x200'
				this.qrCodeUrl = url + '?data=' + this.textContent
				console.log(url + '?data=' + this.textContent + '&size=' + size);
				// uni.request({
				// 	url: 'https://api.qrserver.com/v1/create-qr-code/',
				// 	data: {
				// 		data: this.textContent,
				// 		size: '200x200', // 设置二维码尺寸
				// 	},
				// 	success: (res) => {
				// 		if (res.statusCode === 200) {
				// 			const qrCodeUrl = res.data.replace(/^.*?<img src="(.*)".*$/, '$1');
				// 		}
				// 	},
				// 	fail: (err) => {
				// 		console.error('Failed to generate QR code:', err);
				// 	},
				// });
			}
		}
	}
</script>

<style lang="scss">
	.qrcode {
		border: 1px solid #ebebeb;
		background-color: #ebebeb;
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 20upx 0;
	}
</style>